<!--
 * @Author: your name
 * @Date: 2020-06-01 13:52:25
 * @LastEditTime: 2020-06-04 11:37:32
 * @LastEditors: Please set LastEditors
 * @Description:创建单聊或群聊
 * @FilePath: \IM_Web\im_web\src\components\createChat\index.vue
--> 
<template>
    <div>
        <div
            class="add_icon flex align_center justify_center"
            @click="modal = true"
            v-if="$store.state.Tabs === 1"
        >
            <Icon type="ios-add-circle-outline" />
        </div>
        <div
            class="add_icon_1 flex align_center justify_center"
            @click="modal = true"
            v-if="$store.state.Tabs === 2"
        >
            <Icon type="ios-add" />
        </div>
        <div>
            <Modal
                v-model="modal"
                title="Common Modal dialog box title"
                @on-ok="ok"
                @on-cancel="cancel"
            >
                <p>Content of dialog</p>
                <p>Content of dialog</p>
                <p>Content of dialog</p>
            </Modal>
        </div>
    </div>
</template>

<script>
export default {
    props: {},
    data() {
        return {
            modal: false
        };
    },
    computed: {},
    created() {},
    mounted() {},
    watch: {},
    methods: {
        ok() {
            this.$Message.info("Clicked ok");
        },
        cancel() {
            this.$Message.info("Clicked cancel");
        }
    },
    components: {}
};
</script>

<style scoped lang="less">
.add_icon {
    width: 24px;
    height: 24px;
    // background: #d7d7d7;
    // border-radius: 4px;
    font-size: 24px;
    font-weight: bolder;
    // text-align: center;
}
.add_icon_1 {
    width: 40px;
    height: 40px;
    font-size: 30px;
    background: #fff;
    border-radius: 10px;
}
</style>
